define(["utils","base"],function(utils,baseClass){
    var Component = function(config){
        var _this = this;

        Component.baseConstructor.call(this,config);

        this.$el.addClass("displayflex yy-icon yy-ai-center yy-jc-center");
        
        var font = this.config.font||"";
        var font_arr = font.split("_");
        this.text = this.config.text;
        var style = this.config.style;
        var iconStyle = this.config.iconStyle;
        var textStyle = this.config.textStyle;


        var textPos = this.config.textPos || "right";
        this.iconDom = null;
        this.textDom = null;
        var font_family,font_code;
        if(font_arr.length==2){
            font_family = font_arr[0];
            font_code = font_arr[1];
            utils.css(this.$el,{fontFamily:font_family});
            this.iconDom = $('<i class="yy-icon-code" data-code="'+font_code+'" data-icon="&#x'+font_code+';"></i>');
            if(iconStyle){
                utils.css(this.iconDom,iconStyle);
            }
        }


        if(this.config.src){
          this.iconDom = $('<div class="yy-icon-img"><img src="'+this.config.src+'"/></div>');
          if(iconStyle){
              utils.css(this.iconDom,iconStyle);
          }
        }


        if(this.text||this.text==0){
          this.text =(this.text===null||this.text===undefined)?"": this.text;

          this.textDom = $("<span class='yy-icon-text yy-text-box'>"+this.text+"</span>");
          if(this.config.numberofline){
            this.textDom[0].style["-webkit-line-clamp"]=this.config.numberofline;
          }
          if(textStyle){
              utils.css(this.textDom,textStyle);
          }
        }

        if(textPos == "left" || textPos == "top"){
          this.textDom && this.$el.append(this.textDom);
          this.iconDom && this.$el.append(this.iconDom);
        }else{
          this.iconDom && this.$el.append(this.iconDom);
          this.textDom && this.$el.append(this.textDom);
        }
        if(this.iconDom){
          if(textPos == "left" || textPos == "right"){
            this.$el.addClass("flex-h");
          }else{
            this.$el.addClass("flex-v");
          }
        }


    }

    utils.extends(Component,baseClass);

    Component.prototype.setFont = function(){

    }
    Component.prototype.setText = function(text){
      this.text = text;
      this.textDom.html(text);
    }
    Component.prototype.getText = function(text){
      return  this.text;
    }
    Component.prototype.setAttribute = function(attr,val){
      this.$el.attr(attr,val);
      this.textDom && this.textDom.attr(attr,val);
      this.iconDom && this.iconDom.attr(attr,val);
    }



    return Component;
});
